
<template>
	<div class="shoukuanzhanghupeizhi">
        <div v-if="!shoujiban">
            <div>
            <left></left>
            <div class="right">
                <div style="height: 91px; border-bottom: 1px solid rgb(227, 232, 241); width: 100%; padding: 0 30px;" class="flexbc">
                    <el-breadcrumb separator-class="el-icon-arrow-right">
                        <el-breadcrumb-item :to="{ path: '/yongjin' }">财务管理</el-breadcrumb-item>
                        <el-breadcrumb-item>收款账户配置</el-breadcrumb-item>
                    </el-breadcrumb>
                    <top></top>
                </div>
                <div style=" padding: 37px 30px 0 30px; height: calc(100vh - 91px); overflow: auto;">
                    <div class="flexc" style="font-size: 16px; font-weight: bold; margin:50px 0  20px 0;">
                        <div><img src="../../../static/img/yzh.png" style="width: 22px; margin-right: 10px;"></div>
                        <div>分销商收款账户配置</div>
                    </div>
                    <div style="background-color: #F3F4F7;color: #828282;padding: 15px;border-radius: 13px;font-size: 14px; margin-top: 30px;">
                        配置允许分销商绑定的收款账户，请根据支持情况配置，如果您不支持相应的打款方式请关闭该收款账户类型
                    </div>
                    <div class="baibeijing" style=" width: 780px; position: relative;margin-top: 30px;">
                            <div>
                                <div style="display: inline-block;">支付宝账户</div>
                                <div style="display: inline-block;margin-left: 13px;">
                                    <el-switch
                                    v-model="zhifubaoShowvalue"
                                    @change="changezfbSwitch($event,row)">
                                </el-switch>
                                </div>
                                <div style="margin-top: 10px;">支付支付宝&云账户&工猫自动打款，支持手动转账</div>
                            </div>
                    </div>
                    <div class="baibeijing" style=" width: 780px; position: relative;margin-top: 30px;">
                            <div>
                                <div style="display: inline-block;">银行卡账户</div>
                                <div style="display: inline-block;margin-left: 13px;">
                                    <el-switch
                                    v-model="yhkShowvalue"
                                    @change="changeyhkSwitch($event,row)">
                                    </el-switch>
                                </div>
                                <div style="margin-top: 10px;">支付云账户&工猫自动打款和手动转账</div>
                            </div>
                    </div>
                    <div class="baibeijing" style=" width: 780px; position: relative;margin-top: 30px;">
                            <div>
                                <div style="display: inline-block;">微信账户</div>
                                <div style="display: inline-block;margin-left: 13px;">
                                    <el-switch
                                    v-model="wxShowvalue"
                                    @change="changewxSwitch($event,row)">
                                    </el-switch>
                                </div>
                                <div style="margin-top: 10px;">仅支持配置微信商户号自动转账，不支持手动转账</div>
                            </div>
                    </div>
                    <div class="baibeijing" style=" width: 780px; position: relative;margin-top: 30px;">
                            <div>
                                <div style="display: inline-block;">提现金额设置</div>
                                <div style="display: inline-block;margin-left: 13px;">
                                    <el-switch  :active-value="1" :inactive-value="0"
                                    v-model="all.allow_amount_switch"
                                    @change="changeamountSwitch()">
                                    </el-switch>
                                </div>

                                <div style="margin-top: 10px;">当大于设置金额，才可以提现</div>
                                <div class="flexc"  style="margin-top: 20px; color: rgb(64, 66, 71);">请输入金额:<el-input v-model="all.allow_amount" @input="handleEnter()" style="width: 200px; margin:0 10px;" placeholder="请输入金额"></el-input>元</div>
                            </div>
                    </div>
                </div>
            </div>
        </div>

        </div>
        <!-- 手机版 -->
        <div v-if="shoujiban" style="color:rgb(2, 12, 29); font-size: 0.24rem; background: #f6f8fb; padding-top: 1rem;">
            <topandleft></topandleft>
            <div style="background: #fff; padding: 0.3rem;">
                <div class="flexc" style="margin-bottom: 0.3rem;">
                <div style="width: 2px; height: 0.2rem; background: rgb(2, 12, 29); margin-right: 10px; overflow: hidden;"></div>
                <div style="font-size: 0.36rem; font-weight: bold;">财务管理</div>
                </div>
                <div class="flexc" style="margin-bottom: 0.3rem;">
                <div style="color: rgb(175, 179, 188);">首页</div>
                <div style="margin: 0 0.2rem;color: rgb(175, 179, 188);">·</div>
                <div style="color: rgb(175, 179, 188);">财务管理</div>
                <div style="margin: 0 0.2rem;color: rgb(175, 179, 188);">·</div>
                <div>收款账户配置</div>
                </div>
            </div>
            <div style=" padding: 0.3rem;">
                <div class="flexc"  style="font-size: 16px; font-weight: bold; margin:0.5rem 0  0.2rem 0;justify-content: space-between">

                    <div class="flexc" style="font-size: 16px; font-weight: bold; margin:0 0 0.2rem 0;">
                        <div><img src="../../../static/img/yzh.png" style="width: 22px; margin-right: 0.1rem;"></div>
                        <div>分销商收款账户配置</div>
                    </div>
                    <div style="background-color: #F3F4F7;color: #828282;padding: 0.15rem;border-radius: 0.13rem;font-size: 14px;">
                        配置允许分销商绑定的收款账户，请根据支持情况配置，如果您不支持相应的打款方式请关闭该收款账户类型
                    </div>
               </div>

                <div class="baibeijing" style="position: relative;margin-top:0.3rem;">
                        <div>
                            <div style="display: inline-block;">支付宝账户</div>
                            <div style="display: inline-block;margin-left:0.13rem;">
                                <el-switch
                                v-model="zhifubaoShowvalue"
                                @change="changezfbSwitch($event,row)">
                                </el-switch>
                            </div>
                            <div style="margin-top:0.1rem;">支付支付宝&云账户&工猫自动打款，支持手动转账</div>
                        </div>
                </div>
                <div class="baibeijing" style="position: relative;margin-top:0.3rem;">
                            <div>
                                <div style="display: inline-block;">银行卡账户</div>
                                <div style="display: inline-block;margin-left:0.13rem;">
                                    <el-switch
                                    v-model="yhkShowvalue"
                                    @change="changeyhkSwitch($event,row)">
                                    </el-switch>
                                </div>
                                <div style="margin-top:0.1rem;">支付云账户&工猫自动打款和手动转账</div>
                            </div>
                </div>
                <div class="baibeijing" style="position: relative;margin-top:0.3rem;">
                            <div>
                                <div style="display: inline-block;">微信账户</div>
                                <div style="display: inline-block;margin-left: 0.13rem;">
                                    <el-switch
                                    v-model="wxShowvalue"
                                    @change="changewxSwitch($event,row)">
                                    </el-switch>
                                </div>
                                <div style="margin-top:0.1rem;">仅支持配置微信商户号自动转账，不支持手动转账</div>
                            </div>
                </div>

            </div>
        </div>
    </div>
</template>



<script>
  import _ from 'lodash';
  import left from '../left.vue'
  import top from '../top.vue'
  import footers from '../footer.vue'
  import topandleft from '../topandleft.vue'
	export default {
		name: 'shoukuanzhanghupeizhi',
    components:{
      left,top,topandleft,footers
    },
		data() {
			return {
                zhifubaoShowvalue:false,
                zfbswitchshow:'',
                yhkShowvalue:false,
                yhkswitchshow:'',
                wxShowvalue:false,
                wxswitchshow:'',
                shoujiban:false,
                widthss:false,
                all:{

                }
			}
		},
		created() {
            this.getpeizhiInfo()
		},
		mounted() {

            if(window.screen.width == 1920){
                this.widthss = true
            }
            document.addEventListener('paste', this.getClipboardFiles)

            if(window.screen.width < 1080){
                this.shoujiban = true
                var h = document.documentElement.clientWidth / 7.5 + 'px';
                document.documentElement.style.fontSize = h;

            }else{

            }

		},

		methods: {
            //一进页面自动获取开关配置信息
            getpeizhiInfo(){
                    axios.get('/own/pay/way/get').then((response)=>{
                    if (response.data.msg.code == 0) {
                      this.all = response.data.data
                        //获得支付宝开关
                        if(response.data.data.alipay_display=='1'){
                        this.zhifubaoShowvalue = true //开

                        }
                        if(response.data.data.alipay_display=='0'){
                        this.zhifubaoShowvalue = false //关
                        }

                        //获得银行卡开关
                        if(response.data.data.bank_display=='1'){
                        this.yhkShowvalue = true //开
                        }
                        if(response.data.data.bank_display=='0'){
                        this.yhkShowvalue = false //关
                        }

                        //获得微信开关
                        if(response.data.data.wxpay_display=='1'){
                        this.wxShowvalue = true //开
                        }
                        if(response.data.data.wxpay_display=='0'){
                        this.wxShowvalue = false //关
                        }

                    } else {
                        this.$message.error(response.data.msg.info);
                    }
                })
            },
            //支付宝开关转换
            changezfbSwitch(val,row){
                // console.log('val,row',val,row)
                if(val==true){
                this.zfbswitchshow = '1'
                }
                if(val ==false){
                this.zfbswitchshow = '0'
                }
                if(this.zhifubaoShowvalue==true){
                this.zfbswitchshow='1'
                }
                if(this.zhifubaoShowvalue==false){
                this.zfbswitchshow='0'
                }
                let obj={
                    alipay_display:this.zfbswitchshow
                }
                console.log('obj',obj)

                axios.post('/own/pay/way/update',obj).then((response)=>{
                    if (response.data.msg.code == 0) {
                    this.$message.success('支付宝账户状态修改成功！');
                    this.getpeizhiInfo()


                }else{
                    this.$message.error(response.data.msg.info);
                }})

            },
            //银行卡开关转换
            changeyhkSwitch(val,row){
                if(val==true){
                this.yhkswitchshow = '1'
                }
                if(val ==false){
                this.yhkswitchshow = '0'
                }
                if(this.yhkShowvalue==true){
                this.yhkswitchshow='1'
                }
                if(this.yhkShowvalue==false){
                this.yhkswitchshow='0'
                }
                let obj={
                    bank_display:this.yhkswitchshow
                }
                console.log('obj',obj)

                axios.post('/own/pay/way/update',obj).then((response)=>{
                    if (response.data.msg.code == 0) {
                    this.$message.success('银行卡状态修改成功！');
                    this.getpeizhiInfo()


                }else{
                    this.$message.error(response.data.msg.info);
                }})
            },
            handleEnter: _.debounce(function(row) {
                var that = this
                axios.post('/own/pay/way/update',this.all).then((response)=>{
                    if (response.data.msg.code == 0) {
                    this.$message.success('修改成功！');
                    this.getpeizhiInfo()
                }else{
                    this.$message.error(response.data.msg.info);
                }})
            }, 1000),
            changeamountSwitch:function(val,row){
              axios.post('/own/pay/way/update',this.all).then((response)=>{
                  if (response.data.msg.code == 0) {
                  this.$message.success('修改成功！');
                  this.getpeizhiInfo()
              }else{
                  this.$message.error(response.data.msg.info);
              }})
            },
            //微信开关转换
            changewxSwitch(val,row){
                console.log('微信val',val)
                if(val==true){
                this.wxswitchshow = '1'
                }
                if(val ==false){
                this.wxswitchshow = '0'
                }
                if(this.wxShowvalue==true){
                this.wxswitchshow='1'
                }
                if(this.wxShowvalue==false){
                this.wxswitchshow='0'
                }
                let obj={
                    wxpay_display:this.wxswitchshow
                }
                console.log('obj',obj)

                axios.post('/own/pay/way/update',obj).then((response)=>{
                    if (response.data.msg.code == 0) {
                    this.$message.success('微信修改成功！');
                    this.getpeizhiInfo()


                }else{
                    this.$message.error(response.data.msg.info);
                }})
            }
		}
	}
</script>

<style scoped>
.t_yzh{
  color: #005AFF;
  background-color: #E4EDFF;
  padding: 5px 10px;
  border-radius: 25px;
  font-size: 12px;
  cursor: pointer;
}
</style>
<style scoped lang="less">
.shoukuanzhanghupeizhi{

}
</style>

